$(function () {
    var moving = false;
    var imgList = $(".imgList img");
    var id = 0;
    var $points = $(".quanList div");

    $(".left").click(function () {
        if (moving == false) {
            move(true);
            updateId(true);
        }
    });
    $(".right").click(function () {
        if (moving == false) {
            move(false);
            updateId(false)
        }
    })
    $points.click(function () {
        var index = $(this).index();
        id = index;
        var left = (index + 1) * 600;
        $(".imgList").css("left", -left);
        $points.eq(id).siblings().removeClass("on");
        $points.eq(id).addClass("on");
        // var itemTime = 5;
        // var time = 500;
        // var count = time / itemTime;
        // var itemLang = left/count;
        // var timer = setInterval(function () {
        //     left-= itemLang;
        //     if (left <= 0) {
        //         clearInterval(timer);
        //         moving = false;
        //     }

        //     $(".imgList").css("left", (-left)+"px");
        // }, itemTime)

    })
    function move(boolean) {
        moving = true;
        if (boolean == true) {
            var left = $(".imgList").position().left;
            if (left <= -3600) {
                left = -600
            }
            var itemTime = 5;
            var time = 500;
            var count = time / itemTime;
            var lang = 600;
            var itemLang = lang / count;
            var timer = setInterval(function () {
                lang -= itemLang;
                if (lang <= 0) {
                    lang = 600
                    clearInterval(timer);
                    moving = false;
                }
                left -= itemLang;
                $(".imgList").css("left", left);
            }, itemTime)
        };
        if (boolean == false) {
            var right = $(".imgList").position().left;
            if (right >= 0) {
                right = -3000;
            }
            var itemTime = 5;
            var time = 500;
            var count = time / itemTime;
            var lang = 600;
            var itemLang = lang / count;
            var timer = setInterval(function () {
                lang -= itemLang;
                if (lang <= 0) {
                    lang = 600
                    clearInterval(timer);
                    moving = false;
                }
                right += itemLang;
                $(".imgList").css("left", right);
            }, itemTime)
        };
    }
    function updateId(boolean) {
        if (boolean) {
            id++;
            if (id == 5) {
                id = 0
            }
            console.log(id);
        } else {
            id--;
            if (id == -1) {
                id = 4
            }
        }
        $points.eq(id).siblings().removeClass("on");
        $points.eq(id).addClass("on");
    }
    var timerAll = setInterval(function () {
        var left = $(".imgList").position().left;
        if (left <= -3600) {
            left = -600
        }
        id++;
        if (id >= 5) {
            id = 0
        };
        $points.eq(id).siblings().removeClass("on");
        $points.eq(id).addClass("on");
        var itemTime = 5;
        var time = 500;
        var count = time / itemTime;
        var lang = 600;
        var itemLang = lang / count;
        var timer = setInterval(function () {
            lang -= itemLang;
            if (lang <= 0) {
                lang = 600
                clearInterval(timer);
                moving = false;
            }
            left -= itemLang;
            $(".imgList").css("left", left);
        }, itemTime)
    }, 2000)
    $(".container").hover(function () { 
            clearInterval(timerAll);
        }
        , function () {
            timerAll = setInterval(function () {
                var left = $(".imgList").position().left;
                if (left <= -3600) {
                    left = -600
                }
                id++;
                if (id >= 5) {
                    id = 0
                };
                $points.eq(id).siblings().removeClass("on");
                $points.eq(id).addClass("on");
                var itemTime = 5;
                var time = 500;
                var count = time / itemTime;
                var lang = 600;
                var itemLang = lang / count;
                var timer = setInterval(function () {
                    lang -= itemLang;
                    if (lang <= 0) {
                        lang = 600
                        clearInterval(timer);
                        moving = false;
                    }
                    left -= itemLang;
                    $(".imgList").css("left", left);
                }, itemTime)
            }, 2000)
        })
})